<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jstl/fmt_rt"%>

<html>
  <head>
    <title>打卡记录</title>
    <script src="jquery-1.11.1.min.js"></script>

  </head>
  <body>

  <div style="">
<a href="lg" style="float: right;font-weight: bolder;border: 2px solid blue;" >退出</a><br/>

    <tr align="center">
      <td width="20%"  >
          <c:if test="${sessionScope.flag=='admin'}">
          姓名：<input id="searchuser" value="${searchUser}" />
              <select id="chooseuser">
                  <option></option>
                  <c:forEach items="${sessionScope.users}" var="user">
                      <option <c:if test="${searchUser==user}">selected</c:if> value="${user}">${user}</option>
                  </c:forEach>
              </select>
      </c:if>
      </td>
      <td width="20%">
      <select id="year">
          <option <c:if test="${year=='2019'}">selected</c:if> >2019</option>
          <option <c:if test="${year=='2020'}">selected</c:if> >2020</option>
          <option <c:if test="${year=='2021'}">selected</c:if> >2021</option>
      </select>年
        <select id="search">
        <c:forEach items="1,2,3,4,5,6,7,8,9,10,11,12" var="m">
          <option value="${m}" <c:if test="${month==m}">selected</c:if> >${m}</option>
        </c:forEach>
        </select>
        月

      </td>
      <td width="30%"><button onclick="searchWk()">查询</button></td>
      <td width="30%"></td>
    </tr>



  <table border="1" width="95%"  >
    <tr align="center" style="background-color: lightskyblue;">
      <td width="20%" >人员</td>
      <td width="20%">日期</td>
      <td width="30%">上午</td>
      <td width="30%">下午</td>
    </tr>
  <c:forEach items="${list}" var="dk">
    <tr align="center"   <c:if test="${dk.zm=='1'}">style="background-color: #FF6600;"</c:if>  >
      <td>${dk.user}</td>
      <td>${dk.date}</td>
      <td <c:if test="${dk.chiDao=='1' && dk.zm!='1'}">style="color: red;font-weight: bolder;" </c:if> >
           ${dk.startTime}<c:if test="${dk.dkf=='1' && dk.zm!='1' }">未打卡</c:if>
      </td>

      <td <c:if test="${dk.zaoTui=='1' && dk.zm!='1'}">style="color: red;font-weight: bolder;" </c:if> >
           ${dk.endTime}<c:if test="${dk.dkf=='1'&& dk.zm!='1' }">未打卡</c:if>
      </td>



    </tr>
  </c:forEach>
  </table>

</div>

  </body>

  <script type="text/javascript" >
      function searchWk(){
          var month = $("#search").val();
          var year = $("#year").val();
          var searchuser = $("#searchuser").val();
          var urls = "wk?year="+year+"&month="+month;
          if(searchuser){
              urls+="&searchuser="+searchuser;
          }
          if(month){
              location.href = urls;
          }
      }

    $(function () {
        $("#chooseuser").on("change",function () {
            var chooseuser = $("#chooseuser").val();
            if(chooseuser&& chooseuser!=""){
                $("#searchuser").val(chooseuser);
            }
        });

    })

  </script>
</html>
